import React from "react";
import { Provider } from "react-redux";
import store from "./Store";
import {
  BrowserRouter as Router,
  Route,
  Switch,
  Redirect
} from "react-router-dom";
import routers from "./Route";
import Header from "./Components/Header/Header";
import Footer from "./Components/Footer/Footer";
import PrivateAuth from './Components/PrivateAuth/PrivateAuth';

function App() {
  return (
    <Provider store={store}>
      <Router>
        <div className="App">
          <Header />
          <Switch>
            {routers.map((route, key) => {
              return route.isAuth ? (
                <PrivateAuth 
                  key={key}
                  path={route.path}
                  component={route.component}
                  exact={route.exact ? true : false}
                />
              ) : (
                <Route
                  key={key}
                  path={route.path}
                  component={route.component}
                  exact={route.exact ? true : false}
                />
              );
            })}
            <Redirect to="/404" />
          </Switch>
          <Footer/>
        </div>
      </Router>
    </Provider>
  );
}

export default App;
